/**
 * @class yijs.Slider
 * @extends yijs.proxy.MicroBlog
 * @fileOverview 滑动条组件
 * @author 谢文浩
 * @email mohaiguyan12@126.com
 * @version 0.13
 * @date 2010-03-13
 */

/**
 * @constructor
 * @param {Object} options
 */
yijs.Slider = function(options){
	var defaults = {
		/** 是否自动运行组件（如果为false，请在实例化组件类后，调用render（）方法）*/
		autoRender : false,		
		renderTo : null,
		id : null,
		applyTo : null,
		width : 140,
		height:17,
		style : null,
		//是否使用动画
		animate: false,
		distance: 0,
		//最大值
		max: 100,
		//最小值
		min: 0,
		range: "min",
		//步进
		step: 1,
		//默认值
		value: null,
		values : null,
		enabled : true,
		listeners : {
			slide : null
		}		
	}
	this.options = $.extend(defaults, options);	
	this.listeners = this.options.listeners;
	this.$applyTo = null;
	this.$handle = null;
	this.tpl =  '<div class="yijs_slider_l">'+
                '</div>'+
                '<div class="yijs_slider_m">'+
                '</div>'+
                '<div class="yijs_slider_r">'+
                '</div>'+ 
				'<div class="yijs_slider_vessel">' +
	                '<div class="yijs_slider_range">'+
	                    '<div class="yijs_slider_l yijs_slider_range_l">'+
	                    '</div>'+
	                    '<div class="yijs_slider_m yijs_slider_range_m">'+
	                    '</div>'+
	                    '<div class="yijs_slider_r yijs_slider_range_r">'+
	                    '</div>'+                 
	                '</div>'+
	                '<div class="yijs_slider_handle"></div>'+
				'</div>';  
	this.distance = this.getDistance();
	this.position = null;
	this.value = this.options.min;
	this.max = this.options.max;
	this.min = this.options.min;
	this.enabled = this.options.enabled;		
	if(this.options.autoRender) this.render();		
}

yijs.Slider.prototype = {
	/**
	 * 运行
	 */	
	render : function(){
		var _that = this;
		var _opts = this.options;
		if(_opts.renderTo || _opts.applyTo){
			_opts.renderTo != null && $(_opts.renderTo).html("<div class='yijs_slider clearfix'/>");
			this.$applyTo = _opts.applyTo != null && $(_opts.applyTo) ||  _opts.renderTo != null && $(_opts.renderTo).children();
			this.$applyTo.attr("id") == "" && _opts.id != null && this.$applyTo.attr("id",_opts.id);	
			this._create();
			this.setEnabled();
			
			this.$handle.bind({
				mousedown : function(e){
					_that.enabled && _that._mouseStart(e);
					e.stopPropagation();
					return false;
				},
				mouseover : function(e){						
					_that.enabled && $(this).addClass("yijs_slider_handle_over");
				},
				mouseout : function(e){
				  !_that._dragStart && _that.enabled && $(this).removeClass("yijs_slider_handle_over");
				}
			})
			this.$applyTo.mousedown(function(e){						 
				var _position = {x:e.pageX,y:e.pageY};
				var _handlerPostion = _that.getHandlePosition();
				var _pos = _position.x - _handlerPostion.x;
				var _val = _pos > 0 && Math.ceil(_pos/_that.distance) || Math.floor(_pos/_that.distance);
				_val += _that.value; 
				_that.slideTo(_val);
				return false;
			})	

		}
	},
	/**
	 * 滚动到指定位置
	 * @param {Number} val 值
	 */
	slideTo : function(val){
	    if(val <= this.max && val >= this.min){
			var _valuePercent = this.getValuePercent(val)+"%";
			this.$handle.css("left",_valuePercent);
			this._slideRange(_valuePercent);
			val != this.value && this.listeners.slide && this.listeners.slide.call(this,val);
			this.value = val;				
		}					
	},
	/**
	 * 获取滑动块单位滑动距离
	 */
	getDistance : function(){
		var _distance = this.options.width/Math.floor(this.options.max - this.options.min);
		return _distance;
	},
	getStep : function(){
		
	},
	/**
	 * 获取当前的滑动条的值
	 */
	getValue : function(){
		return this.value;
	},
	/**
	 * 获取指定值在滑动条位置百分比
	 * @param {Number} val   值
	 */
	getValuePercent : function(val){
		var _value =  val;
	    var _valueMin = this.min;
		var	_valueMax = this.max;
		var _valuePercent = _valueMax != _valueMin && (_value - _valueMin) / (_valueMax - _valueMin) * 100 || 0;
		return  Math.floor(_valuePercent*100)/100;			
	},
	getHandlePosition : function(){
			var _offset = this.$handle.offset();

			return {x : _offset.left,y:_offset.top };	
	},
	/**
	 * 重置
	 */
	reset : function(min,max){
		if(min) this.min = min;
		if(max) this.max = max;
		this.setEnabled();
		this.value = this.min;
		this.slideTo(this.value);
	},
	setEnabled : function(){
	    this.enabled = this.max == this.min && false || true;
		return this.enabled;
	},
	/**
	 * 创建
	 */
	_create : function(){
		if(this.$applyTo != null){
			this.$applyTo.html(this.tpl);
			this._setStyle();
			this.$handle = this.$applyTo.find(".yijs_slider_handle");
			this.position = this.getHandlePosition();
			!this.enabled && this.$handle.addClass("yijs_slider_handle_unusable");　
		}
	},
	/**
	 * 设置样式
	 */
	_setStyle : function(){
		if(this.$applyTo != null){
			var _opts = this.options;
			var _middleContainerWidth = _opts.width - 15;
			this.$applyTo.width(_opts.width).height(_opts.height);
			this.$applyTo.children(".yijs_slider_m").width(_middleContainerWidth);
			this.$applyTo.children(".yijs_slider_l").width(5);	
			var _$vessel = this.$applyTo.children(".yijs_slider_vessel");
			_$vessel.width(_opts.width - 16);
		}		
	},
	/**
	 * 鼠标开始移动
	 * @param {Object} e 鼠标事件
	 */
	_mouseStart : function(e){
			var _that = this;
			this.position = {x:e.pageX,y:e.pageY};
			this._dragStart = true;
		   //给document绑定拖动与拖动结束事件	
		    jQuery(document).bind({
				mousemove : function(e){				
					_that._mouseDrag(e);
					e.preventDefault();
					return false;
				},
				mouseup : function(e){
					_that._mouseStop(e);
					e.preventDefault();
					return false;
				}
			})
					
	},
	/**
	 * 鼠标正在移动
	 * @param {Object} e 鼠标事件
	 */
	_mouseDrag : function(e){
		var _position = {x:e.pageX,y:e.pageY};
		var _pos = _position.x - this.getHandlePosition().x;

			var _val = Math.floor(_pos/this.distance);
			_val += this.value; 
			this.slideTo(_val);
	

		return false;
	},
	/**
	 * 鼠标移动结束
	 * @param {Object} e 鼠标事件
	 */
	_mouseStop : function(e){
		this._dragStart = false;
		jQuery(document).unbind("mousemove").unbind("mouseup");
		this.$handle.removeClass("yijs_slider_handle_over");
		return false;
	},
	_slideRange : function(valuePercent){
		if(this.options.range == "min"){
			var _$range = this.$applyTo.find(".yijs_slider_range");
			var _$range_m = this.$applyTo.find(".yijs_slider_range_m");
			_$range.width(valuePercent) && _$range_m.width(_$range.width()-6);				
		}		
	}
}
